<template>
    <div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>单位名称</label>
                <i class="iconfont icon-required"></i>
            </div>
            <div>
                <input type="text"
                       placeholder="请输入您的单位"
                       v-model="UnitName">
            </div>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>请选择地址</label>
                <i class="iconfont icon-required"></i>
            </div>
            <group>
                <x-address :title="title"
                           v-model="city"
                           ref="address"
                           :list="addressData"
                           :hide-district="true"
                           placeholder="请选择地址"></x-address>
            </group>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>单位类型</label>
                <i class="iconfont icon-required"></i>
            </div>
            <group>
                <popup-picker :data="list1"
                              v-model="companyStyle"
                              placeholder="请选择"></popup-picker>
            </group>
        </div>
        <div class="form-item form-item-style1">
            <div class="label-title">
                <label>单位编码</label>
            </div>
            <div>
                <p v-if="unitDetail.SequenceCode">{{unitDetail.SequenceCode}}</p>
                <input v-else
                       type="text"
                       disabled
                       placeholder="自动生成不需手动输入">
            </div>
        </div>
        <div class="form-item form-item-style1 seq-Code">
            <div class="label-title">
                <label>上级单位编码</label>
            </div>
            <div>
                <input type="text"
                       placeholder="请输入上级单位编码"
                       v-model="ParentSeqCode"
                       @input="seqCodverify">
            </div>
            <i class="hint"
               v-show="ParentSeqCode&&!codeExist">单位编码不存在</i>
        </div>
        <div class="btns">
            <button class="width200"
                    @click="SaveUnit">提交</button>
        </div>
        <myMenu></myMenu>
    </div>
</template>
<script>
import { Group, XAddress, ChinaAddressV4Data, XButton, Cell } from 'vux'
import { setTimeout, clearTimeout } from 'timers'
export default {
    name: 'addCompany',
    components: {
        Group,
        XAddress,
        XButton,
        Cell
    },
    data () {
        return {
            title: '',
            UnitName: '',
            city: [],
            list1: [['公司', '项目']],
            addressData: ChinaAddressV4Data,
            companyStyle: [],
            isModify: false, // 是否是修改单位信息，true是修改false是新增
            registerInfo: {},
            codeExist: true, // 单位编码是否存在
            ParentSeqCode: '',
            unitDetail: {}, // 单位详情
            timeout: null
        }
    },
    created () {
        this.isModify = !this.$route.params.type
        this.registerInfo = JSON.parse(localStorage.getItem('registerInfo'))
    },
    mounted () {
        this.registerInfo.departId && this.GetEntity()
    },
    methods: {
        seqCodverify () {
            clearTimeout(this.timeout)
            this.timeout = setTimeout(() => {
                this.GetEntityBySeqCode()
            }, 500)
        },
        GetEntityBySeqCode () {
            if (this.ParentSeqCode === '') return
            let params = {
                seqCode: this.ParentSeqCode
            }
            this.$axiosAjax.GetEntityBySeqCode(params).then((res) => {
                if (res.data.code === 0) {
                    if (res.data.data) {
                        this.codeExist = true
                    } else {
                        this.codeExist = false
                    }
                } else {
                    this.$vux.toast.text(res.data.info)
                }
            })
        },
        GetEntity () {
            let params = {
                unitId: this.registerInfo.departId
            }
            this.$axiosAjax.GetEntity(params).then((res) => {
                if (res.data.code === 0) {
                    this.unitDetail = res.data.data
                    this.UnitName = this.unitDetail.UnitName
                    this.city = [this.unitDetail.Province, this.unitDetail.City]
                    this.companyStyle = [this.unitDetail.UnitType]
                    this.ParentSeqCode = this.unitDetail.ParentSeqCode
                } else {
                    this.$vux.toast.text(res.data.info)
                }
            })
        },
        SaveUnit () {
            if (!this.UnitName) {
                this.$vux.toast.text('请输入单位名称')
                return false
            } else if (!this.$refs.address.nameValue) {
                this.$vux.toast.text('请选择地址')
                return false
            } else if (!this.companyStyle[0]) {
                this.$vux.toast.text('请选择单位类型')
                return false
            } else if (this.ParentSeqCode && !this.codeExist) {
                this.$vux.toast.text('输入的上级单位编码不存在')
                return false
            }
            let params = {
                userId: this.registerInfo.userId,
                data: {
                    UnitId: this.registerInfo.departId, // 新增是UnitId 为空
                    UnitName: this.UnitName, // 单位名称  (必填)
                    ParentSeqCode: this.ParentSeqCode, // 新增时可不传
                    UnitType: this.companyStyle[0], // 公司/项目  (必填)
                    Province: this.$refs.address.nameValue.split(' ')[0],
                    City: this.$refs.address.nameValue.split(' ')[1],
                    SortCode: ''

                }
            }
            this.$axiosAjax.SaveUnit(params).then((res) => {
                if (res.data.code === 0) {
                    this.registerInfo.departName = res.data.data.UnitName
                    this.registerInfo.departId = res.data.data.UnitId
                    localStorage.setItem('registerInfo', JSON.stringify(this.registerInfo))
                    this.$router.replace('/epidemicFKEntery')
                } else {
                    this.$vux.toast.text(res.data.info)
                }
            })
        }
    }
}
</script>
<style scoped>
.seq-Code {
    position: relative;
}
.seq-Code i {
    position: absolute;
    top: 40px;
    right: 20px;
    color: red;
    font-size: 12px;
}
</style>
